<!DOCTYPE html>
<html lang="en" >
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link    rel="stylesheet" href="bootstrap-3.3.7-dist/css/bootstrap.min.css">
    <script  src="bootstrap-3.3.7-dist/js/jquery-3.4.1.min.js"></script>
    <script  src="bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>

</head>

<style>
    .layout {
        width: 375px;
        height: 667px;
        margin: 50px auto;
        border: solid gray 0px;
        position: relative;
    }
    img {
        position: relative;
        left: -21%;
        top: -30%;
    }
    ul {
        position: absolute;
        width: 100%;
        top: 24%;
    }
    li {
        width: 30%;
        height: 50px;

        color: #337AB7;
        font-size: 20px;
        text-align: center;

    }
    hr {
        margin: 2px;
    }
</style>









<body>
<div class="layout">
    <img src="pic/logo.png"alt="">
    <ul class="nav nav-pills nav-stacked" id="1">


    </ul>
</div>
<script>

    $.ajax({
        url:"/department/category",
        type:"get",
        dataType:"json",
        success: function (data) {
			
            for (var i in data) {
			
                $("#1").append("<li role='presentation' id='xiangqing' ><a href='javascript:;' detpid='"+data[i].depid+"' >" + data[i].deptype + "</a></li>")
				
            }
			
			//绑定每个a标签点击事件
			$("#1 a").click(function(){
				var that = $(this);
				var depid = that.attr("detpid");
				deptClick(depid);
			});
			
        }
    });


	function deptClick(depid){
		 $.post("/staffinfo/doctor",{depid:depid},function(data){

			window.location.href = "doctordetails.html";
		});
	}

</script>
</body>

</html>









